<template>
	<div class="header">
			<logosvg class="header-logo"/>
			<div class="topfr">
				<span class="topbton">下载APP</span>
			</div>
		</div>
</template>

<script>
	import logosvg from '@/svg/logo.svg'
	export default {
		components: {
		   logosvg
		}
	}
</script>

<style lang="scss" scoped>
	@charset "utf-8";
	$fs:64px;
	html{
	    font-size: $fs;
	}
	@function r($px){
	    @return $px/$fs*1rem;   
		
	}
	.header{
		width: 100%;
		height: r(128px);
		background-color: #d43c33;
		position: fixed;
	    top: 0;
	    left: 0;
	    z-index: 999;
	    display: flex;
	    align-items: center;
	    justify-content: space-between;
    	padding: 0 r(20px);
    	.header-logo{
    		width: r(284px);
		    height: r(50px);
    	}
    	.topfr{
    		height: r(60px);
		    line-height: r(60px);
		    padding: 0 r(20px);
		    color: #fff;
		    font-size: r(30px);
		    border: r(2px) solid rgba(255,255,255,.4);
		    border-radius: 37.5%/100%;
    	}
	}
</style>